<template>
  <basic-container>
    <div>
      <m-s-search @searchClick="v=>{queryForm=v}" :list="viewListOption.column"></m-s-search>
    </div>
    <avue-crud :option="viewListOption"
               :table-loading="loading"
               :data="data"
               @selection-change="v=>selection=v"
               ref="crud"
               :page.sync="page">
      <template slot="menuLeft" slot-scope="{size}">
        <el-button :size="size" type="primary" @click="addToTabsList('视图',{oid:-1},'viewListTemp','open')">
          创建
        </el-button>
        <el-button :size="size" :disabled="selection.length===0">删除</el-button>
        <el-button :size="size" :disabled="selection.length===0">发布</el-button>
        <el-button :size="size" :disabled="selection.length===0">作废</el-button>
      </template>

      <template slot="nameCn" slot-scope="{row}">
        <span class="column-btn">
          {{ row.nameCn }}
        </span>
      </template>

      <template slot="menu" slot-scope="{row}">
        <el-button type="text">查看详情</el-button>
        <el-button type="text">修改</el-button>
        <el-button type="text">禁用</el-button>
      </template>
    </avue-crud>

    <ms-drawer ref="md" :visible.sync="visible" :tab-list.sync="tabsList"></ms-drawer>
  </basic-container>
</template>
<script>
import MSSearch from "@/DMDComponents/MSSearch.vue";

export default {
  name: "viewList",
  components: {MSSearch},
  inject: ["viewListOption"],
  data() {
    return {
      queryForm: {},
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      data: [],
      loading: false,
      selection: [],

      visible: false,
      tabsList: [],
    }
  },
  methods: {
    addToTabsList(title, row, component, type) {
      let ids = this.tabsList.map(item => (item.row.oid + "-" + item.component));
      if (!ids.includes((row.oid + "-" + component))) {
        this.tabsList.push({title, row, component, type})
      }
      this.visible = true;
    },
  }
}
</script>
<style scoped>

</style>
